<%@page import="org.swim.remote.entities.IAbility.Status"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
	pageEncoding="UTF-8" import="org.swim.web.utils.*"
	import="org.swim.remote.entities.*"%>
<%@page import="org.apache.commons.lang.WordUtils"%>
<%@page import="java.util.ArrayList"%>
<%@page import="org.swim.web.servlet.consts.*"%>
<%@page import="java.util.List"%>

<!DOCTYPE html>
<html lang="en">
<head>
<%@include file="include/header.jsp"%>
<style type="text/css">

/* 	Collaboration */
.profile {
	padding: 15px;
	padding-top: 10px;
	margin: 15px;
}

.profile .alert {
	padding-right: 14px;
}

.profile:HOVER {
	background: #EEE;
}

.profile p {
	line-height: normal;
}
</style>

<%
	IUser owner = (IUser) request.getAttribute("owner");
	List<IAbility> abilities = new ArrayList<IAbility>(
			owner.getAbilitiesSet());
%>

<title><%=SwimConst.getTitle("Profile")%></title>
</head>
<body>
	<%@include file="include/navbar.jsp"%>
	<%@include file="include/error-handling.jsp"%>

	<!-- Start Remove Account Modal -->
	<div id="removeAccount" class="modal hide fade" tabindex="-1"
		role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
		<form method="post"
			action="<%=SwimConst.Url.Servlet.HOME%>?a=<%=Action.REMOVEACCOUNT.name().toLowerCase()%>">
			<div class="modal-header">
				<h3 id="myModalLabel">Are you sure to remove your account?</h3>
			</div>
			<div class="modal-body">
				<p>If you want remove your account you must insert password</p>
				<p>
					<input placeholder="Type your password..." type="password"
						name="password">
				</p>
			</div>
			<div class="modal-footer">
				<button class="btn" data-dismiss="modal" aria-hidden="true">Cancel</button>
				<button class="btn btn-danger" type="submit">Remove</button>
			</div>
		</form>
	</div>
	<!-- End Remove Account Modal -->

	<div class="container">
		<div class="row">
			<div class="span8 ui-corner-all" style="background: #DDD">
				<div class="row">
					<div class="span8">
						<div class="row profile medium-text ui-corner-all">
							<h4>My profile</h4>
							<div class="span" style="display: block">
								<img src="<%=SwimConst.Url.WEBCONTENT%>/img/default/user256.png"
									width="126" class="img-polaroid" style="background: #FFF">
							</div>
							<form method="post"
								action="<%=SwimConst.Url.Servlet.PROFILE.toLowerCase()%>?a=<%=Action.UPDATEPROFILE.name().toLowerCase()%>">
								<div class="span">

									<div class="controls controls-row">
										<input class="span2" type="text" placeholder="Name"
											name="name"
											value="<%=SwimUtils.capitalizaName(owner.getName().toLowerCase())%>"
											required> <input name="surname" class="span2"
											type="text" placeholder="Surname"
											value="<%=SwimUtils
					.capitalizaName(owner.getSurname().toLowerCase())%>"
											required>
									</div>
									<div class="controls">
										<%=FormHelper.getHiddenInput("email", owner.getEmail())%>
										<input class="span4" type="email" placeholder="Your email"
											value="<%=owner.getEmail()%>" required disabled="disabled">
									</div>
									<div class="controls controls-row">
										<input class="span3" type="password"
											placeholder="Change password" name="password">
									</div>
									<div class="controls controls-row">
										<input class="span3" type="password"
											placeholder="Confirm password" name="confirmPassword">
									</div>
									<div style="text-align: right"></div>

								</div>
								<p class="span3 offset5">
									<button class="btn btn-primary" type="submit">Update
										profile</button>
								</p>
							</form>
						</div>
					</div>
					<div class="span8">
						<div class="row profile medium-text ui-corner-all">
							<h4>My abilities</h4>
							<div>
								<form class="navbar-form" id="myabilities" method="post"
									action="<%=SwimConst.Url.Servlet.PROFILE%>">
									<%=FormHelper.getHiddenInput("a",
					Action.ADDNEWABILITY.name())%>
									<%=FormHelper.getHiddenInput("name", "")%>
									<div>
										<%
											IAbility ability;
											String name;
											String cssClass = "";
											for (int i = 0; i < abilities.size(); i++) {
												ability = abilities.get(i);
												name = SwimUtils.capitalizeFirstChar(ability.getName()
														.toLowerCase());
												if (ability.getStatus() == Status.CONFIRMED) {
													cssClass = "btn-success";
												} else if (ability.getStatus() == Status.REQUESTED) {
													cssClass = "btn-warning";
												} else if (ability.getStatus() == Status.REJECTED) {
													cssClass = "btn-danger strike-text";
												}
										%>

										<input name="abilities" type="hidden"
											value="<%=SwimUtils.capitalizeFirstChar(ability.getName()
						.toLowerCase())%>">
										<a style="margin-bottom: 5px"
											class="btn btn-remover <%=cssClass%>"
											href="javascript: removeAbility('<%=name%>')"><%=name%></a>
										<%
											}
										%>
										<div class="btn-group input-append">
											<input style="margin-bottom: 5px" autocomplete="off"
												placeholder="Type one ability" class="span3" type="text"
												name="addability"
												data-url="<%=SwimConst.Url.Servlet.SEARCH%>?a=<%=Action.AUTOCOMPLETEABILITY.name()%>&<%=SearchAttr.What.ABILITY.request()%>">
											<button type="submit" class="btn">Add</button>
										</div>
									</div>
								</form>
							</div>
						</div>
					</div>
					<p class="span3 offset5">
						<a class="btn btn-danger"
							href="javascript: $('#removeAccount').modal('show');">Remove
							your account</a>
					</p>
				</div>
			</div>
			<%@include file="include/notifications.jsp"%>
		</div>
	</div>
	<%@include file="include/footer.jsp"%>
	<%@include file="include/script-common.jsp"%>
	<script type="text/javascript"
		src="<%=SwimConst.Url.WEBCONTENT%>/js/myprofile.js"></script>
</body>
</html>